import React, { useState, useEffect } from 'react'
import { IUdFormItem, UdDateRangePicker, UdModalForm, UdTable, http, validators } from '@/lib'
import UdSelect from '@/components/UdFormControls/UdSelect'
import { Icon, Input, Spin, InputNumber, Steps} from 'antd'
import udMainStore from '@/store/UdMain'
import NotFoundContent from '@/components/NotFoundContent'
import apis from '@/apis'
import dayjs from 'dayjs'
import { WrappedFormUtils } from 'antd/lib/form/Form'
import './quotaModal.scss'

export function FileList(props) {
  const { urls } = props
  const items:any = Array.isArray(urls) ? urls : [];
  return (
    <div className="file-list-wrapper">
        {items.length == 0 ? '无附件' : items.map((item, index) => {
                const fileName  = item.replace( /(.*\/)*([^.]+.*)$/ig, '$2')
                const fileType  = /\.(jpg|png)$/.test(item) ? 'image' : 'pdf';
                return <div key={index} className="file-list-item">
                    <Icon type={"file-" + fileType} className="file-list-item-icon"/>
                    <a href={item} target="_blank">{fileName}</a>
                </div>
            }
        )}
    </div>
  )
}
export default React.forwardRef((props:any, ref) => {
    return <FileList {...props}/>
});
